import 'package:app/api/api.dart';
import 'package:app/utils/event_bus_utils.dart';
import 'package:app/utils/http_util.dart';
import 'package:app/utils/md5_utils.dart';
import 'package:app/utils/overlay_utils.dart';
import 'package:app/utils/string_utils.dart';
import 'package:app/utils/toast_utils.dart';
import 'package:app/utils/user_utils.dart';
import 'package:flutter/material.dart';

class LoginDialog extends StatefulWidget {
  const LoginDialog({super.key});

  @override
  State<StatefulWidget> createState() {
    return LoginDialogState();
  }
}

class LoginDialogState extends State<LoginDialog> {
  String? _account;
  String? _password;

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Container(
      width: double.infinity,
      decoration: const BoxDecoration(
          image: DecorationImage(
              image: AssetImage("assets/images/login_dialog_background.png"),
              fit: BoxFit.cover)),
      child: Column(
        children: [
          Container(
            width: double.infinity,
            margin: const EdgeInsets.fromLTRB(38, 38, 0, 0),
            child: const Text(
              "欢迎你！\n很高兴认识你。",
              textAlign: TextAlign.left,
              style: TextStyle(color: Colors.white, fontSize: 28),
            ),
          ),
          Container(
            width: double.infinity,
            margin: const EdgeInsets.fromLTRB(0, 0, 158, 0),
            child: Flex(
              direction: Axis.horizontal,
              children: [
                const Flexible(
                  flex: 2,
                  child: SizedBox(
                    width: double.infinity,
                  ),
                ),
                Flexible(
                    flex: 1,
                    child: Column(
                      children: [
                        const SizedBox(
                          width: double.infinity,
                          height: 38,
                          child: Text(
                            "手机/邮箱/用户名",
                            style: TextStyle(color: Colors.white, fontSize: 18),
                          ),
                        ),
                        SizedBox(
                            child: TextField(
                          onChanged: (value) {
                            _account = value;
                          },
                          decoration: const InputDecoration(
                            hintText: "手机/邮箱/用户名",
                            hintStyle: TextStyle(color: Colors.white),
                            enabledBorder: _Style.enabledBorder,
                            focusedBorder: _Style.focusedBorder,
                            errorBorder: _Style.errorBorder,
                          ),
                        )),
                      ],
                    )),
                Flexible(
                    flex: 1,
                    child: Column(
                      children: [
                        const SizedBox(
                          width: double.infinity,
                          height: 38,
                          child: Text(
                            "请输入密码登陆",
                            style: TextStyle(color: Colors.white, fontSize: 18),
                          ),
                        ),
                        TextField(
                          onChanged: (value) {
                            _password = value;
                          },
                          decoration: const InputDecoration(
                              hintText: "请输入密码登陆",
                              hintStyle: TextStyle(color: Colors.white),
                              border: _Style.border,
                              enabledBorder: _Style.enabledBorder,
                              focusedBorder: _Style.focusedBorder,
                              errorBorder: _Style.errorBorder),
                        )
                      ],
                    )),
                /*  */
              ],
            ),
          ),
          Container(
            width: 128,
            margin: const EdgeInsets.fromLTRB(128, 12, 0, 0),
            height: 38,
            child: TextButton(
              onPressed: () {
                if (GStringUtils.isEmpty(_account) ||
                    GStringUtils.isEmpty(_password)) {
                  GTSUtils.showToast("账户和密码不能为空", context: context);
                  return;
                }
                GOverlayUtils.showLoading(context);
                HttpUtil()
                    .post(Apis.login,
                        params: {
                          "account": _account,
                          "password": GMD5.getMD5(_password!)
                        },
                        formData: true,
                        decryptedResult: true,
                        security: false)
                    .then((value) {
                  if (value.success) {
                    UserStates().login(value.data);
                    GEventBusUtils()
                        .getDefault()
                        .fire(UserStates().getLoginUserInfo());
                  }
                });
              },
              style: ButtonStyle(
                  shape: MaterialStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(18.67))),
                  foregroundColor: MaterialStateProperty.resolveWith((states) {
                    if (states.contains(MaterialState.focused) &&
                        !states.contains(MaterialState.pressed)) {
                      //获取焦点时的颜色
                      return Colors.blue;
                    } else if (states.contains(MaterialState.pressed)) {
                      //按下时的颜色
                      return Colors.deepPurple;
                    }
                    //默认状态使用灰色
                    return Colors.grey;
                  }),
                  backgroundColor: MaterialStateProperty.resolveWith((states) {
                    //设置按下时的背景颜色
                    if (states.contains(MaterialState.pressed)) {
                      return Colors.blue[200];
                    }
                    //默认不使用背景颜色
                    return null;
                  }),
                  side: MaterialStateProperty.all(
                      const BorderSide(color: Colors.grey, width: 1))),
              child: const Text("登录"),
            ),
          )
        ],
      ),
    );
  }
}

class _Style {
  static const OutlineInputBorder border = OutlineInputBorder(
      borderSide: BorderSide(
        color: Colors.white,
      ),
      borderRadius: BorderRadius.all(Radius.circular(28.0)));
  static const OutlineInputBorder enabledBorder = OutlineInputBorder(
      borderSide: BorderSide(
        color: Color(0xffffa500),
      ),
      borderRadius: BorderRadius.all(Radius.circular(28.0)));

  static const OutlineInputBorder focusedBorder = OutlineInputBorder(
      borderSide: BorderSide(
        color: Colors.blue,
      ),
      borderRadius: BorderRadius.all(Radius.circular(28.0)));

  static const OutlineInputBorder errorBorder = OutlineInputBorder(
      borderSide: BorderSide(
        color: Colors.yellow,
      ),
      borderRadius: BorderRadius.all(Radius.circular(28.0)));
}
